@charset "utf-8";
/* CSS Document */
.dressTips{
	position:absolute;
	background:#fff;
	padding:1px;
	box-shadow:0 0 10px rgba(0,0,0,0.15);
	z-index:1000;
	font:14px/1.5 arial,"Microsoft Yahei","Hiragino Sans GB",sans-serif;
	font-size: 14px;
 	color: #666;
	}
.dressTitle{
	background:#F1F0F5;
	height:32px;
	line-height:32px;
	padding:0 5px;
	}
.dressTitle.draggable{
	cursor:move;
}
.dressPad{
	padding:10px 5px;
	}
.dressTitle .icon-spinner{
	float:right;
	padding:9px 0 0 0;
	cursor:pointer;
	}
.dressTitle .icon-spinner:hover{
	color:#333;}
.dressBtnUl{
	margin:0 0 0 5px;
	list-style:none;
	padding:0;
	border:1px solid #CBCBCB;
	overflow:hidden;
	float:left;
	}
.dressBtnBar{
	margin-left:-5px;}
.dressBtnUl li{
	width:28px;
	text-align:center;
	line-height:28px;
	float:left;
	color:#7F7F7F;
	cursor: pointer;
	}
.dressBtnUl li:hover{
	color:#333;
	}
.dressBtnUl li.disabled{
	color:#ccc;
	cursor:default;
	}
.sortablePlaceholder{
	position: relative;
	height:0;
	line-height:0;
	font-size:0;
	display:block;
	z-index:999;
  	}
.sortablePlaceholder div{
	border:1px solid #fff;
	background:#999;
	height:3px;
	line-height:0;
	font-size:0;
	overflow:hidden;
	width:100%;
   	}
.sortablePlaceholder i{
	display:block;
	width:0;
	height:0;
	font-size:0;
	line-height:0;
	border-width:7px;
	border-style:solid;
	border-color:#fff transparent transparent transparent;
	content:'';
	position:absolute;
	left:50%;
	margin-left:-7px;
	top:-15px;
	}
.sortablePlaceholder i:after{
	display:block;
	width:0;
	height:0;
	font-size:0;
	line-height:0;
	border-width:5px;
	border-style:solid;
	border-color:#999 transparent transparent transparent;
	content:'';
	position:absolute;
	left:-5px;
	top:-6px;
 	}
.sortablePlaceholder b{
	display:block;
	width:0;
	height:0;
	font-size:0;
	line-height:0;
	border-width:7px;
	border-style:solid;
	border-color:transparent transparent #fff transparent;
	content:'';
	position:absolute;
	left:50%;
	margin-left:-7px;
	bottom:-19px;
	}
.sortablePlaceholder b:after{
	display:block;
	width:0;
	height:0;
	font-size:0;
	line-height:0;
	border-width:5px;
	border-style:solid;
	border-color:transparent transparent #999 transparent;
	content:'';
	position:absolute;
	left:-5px;
	top:-4px;
 	}
.custom_module_box{
	height:83px;
	width:93px;
	border:1px solid #ddd;
	cursor: pointer;
	text-align:center;
	font-size:12px;
	color:#333;
	opacity:0.5;
	background:#fff;
	position:relative;
	}
.module_loading_box .custom_module_ico{
	display:none;
	}
.module_loading_box .custom_module_name{
	padding-top:55px;
	}
.custom_module_ico{
	width:48px;
	margin:15px auto 5px auto;
 	}
.custom_module_ico img{
	max-width:100%;
	height:auto;
	}
.module_loading{
	width:32px;
	height:32px;
	display:block;
	position:absolute;
	background:url(../images/l_loading.gif) no-repeat;
	border-radius:4px;
	position:absolute;
	top:50%;
	margin:-25px 0 0 -16px;
	left:50%;
	}
.transition{
	-webkit-transition:  0.2s ease-in 0s;
	-moz-transition:  0.2s ease-in 0s;
	-ms-transition:  0.2s ease-in 0s;
	-o-transition:  0.2s ease-in 0s;
	transition:  0.2s ease-in 0s;
	}
/* arrow */
.arrow_1_t i,.arrow_1_r  i,.arrow_1_b  i,.arrow_1_l  i,
.arrow_4_t,.arrow_4_r,.arrow_4_b,.arrow_4_l{
	display:block;
	width:0;
	height:0;
	border-style:solid;
	border-width:8px;
	position:absolute;
	font-size:0;
	line-height:0;
	}
.arrow_1_t i:after,.arrow_1_r i:after,.arrow_1_b i:after,.arrow_1_l i:after{
	display:inline-block;
	width:0;
	height:0;
	overflow:hidden;
	content:'';
	border-width:8px;
	border-style:solid;
	position:absolute;
	}
.arrow_1_t i:after{
	border-color:transparent transparent #fff transparent;
	left:-8px;
	top:-7px;
	}
.arrow_1_r i:after{
	border-color:transparent transparent transparent #fff;
	left:-9px;
	top:-8px;
 	}	
.arrow_1_b i:after{
	border-color:#fff transparent transparent transparent;
	left:-8px;
	top:-9px;
 	}	
.arrow_1_l i:after{
	border-color:transparent #fff transparent transparent;
	left:-7px;
	top:-8px;
 	}	

.arrow_1_t i{
	border-color:transparent transparent #ccc transparent;
 	}
.arrow_1_r i{
	border-color:transparent transparent transparent #ccc;
 	}
.arrow_1_b i{
	border-color:#ccc transparent transparent transparent;
 	}
.arrow_1_l i{
	border-color:transparent #ccc transparent transparent;
 	}	
.arrow_2_t i,.arrow_2_r i,.arrow_2_b i,.arrow_2_l i{
	width:0;
	height:0;
	overflow:hidden;
	border-width:8px;
	border-style:solid;
	display:inline-block;
	position:absolute;
	}
.arrow_3_t i,.arrow_3_r i,.arrow_3_b i,.arrow_3_l i{
	width:0;
	height:0;
	overflow:hidden;
	border-width:6px;
	border-style:solid;
	display:inline-block;
	position:absolute;
	}
/**/
.arrow_2_b i{
	border-color:#FF7676 transparent transparent transparent;
	}
.arrow_2_l i{
	border-color:transparent #FF7676 transparent transparent;
	}
.arrow_2_t i{
	border-color:transparent transparent #FF7676 transparent;
	}
.arrow_2_r i{
	border-color:transparent transparent transparent #FF7676;
	}	
.arrow_3_b i{
	border-color:#2A2A2A transparent transparent transparent;
	}
.arrow_3_l i{
	border-color:transparent #2A2A2A transparent transparent;
	}
.arrow_3_t i{
	border-color:transparent transparent #2A2A2A transparent;
	}
.arrow_3_r i{
	border-color:transparent transparent transparent #2A2A2A;
	}	
.tipsPad{
	padding:4px 10px;
	font-size:12px;
	}
/* arrow End */

/* tips */
.tipsArrow{
 	position: absolute;
	width:16px;
	height:16px;
	}
.tips_1{
	border:1px solid #ccc;
	background:#fff;
	position:absolute;
	line-height:20px;
	}
.tips_1 .arrow_1_l{
 	left:-17px;
	top:50%;
	margin-top:-8px;
	}
.tips_1 .arrow_1_r{
 	right:-17px;
	top:50%;
	margin-top:-8px;
	}
.tips_1 .arrow_1_t{
 	left:50%;
	top:-17px;
	margin-left:-8px;
	}
.tips_1 .arrow_1_b{
 	left:50%;
	bottom:-17px;
	margin-left:-8px;
	}
.tips_2{
	position:absolute;
	background:#FF7676;
	line-height:20px;
 	} 
.tips_2 .arrow_2_b{
	left:50%;
	bottom:-16px;
	margin-left:-8px;
	}
.tips_2 .arrow_2_l{
	left:-16px;
	top:50%;
	margin-top:-8px;
	}
.tips_2 .arrow_2_t{
	left:50%;
	top:-16px;
	margin-left:-8px;
	}
.tips_2 .arrow_2_r{
	top:50%;
	right:-16px;
	margin-top:-8px;
	}	
.tips_3{
	position:absolute;
	background:#2A2A2A;
	line-height:20px;
 	} 
.tips_3 .arrow_3_b{
	left:50%;
	bottom:-16px;
	margin-left:-6px;
	}
.tips_3 .arrow_3_l{
	left:-12px;
	top:50%;
	margin-top:-6px;
	}
.tips_3 .arrow_3_t{
	left:50%;
	top:-12px;
	margin-left:-6px;
	}
.tips_3 .arrow_3_r{
	top:50%;
	right:-16px;
	margin-top:-6px;
	}
.tips_3 .tipsPad,
.tips_2 .tipsPad{
	color:#fff;
	}
.tipsClose{
	height:16px;
	line-height:16px;
	width:18px;
	text-align:center;
	position:absolute;
	right:2px;
	top:2px;
	z-index:9;
	}
.tipsClose:hover i{
	opacity:1;
	}
.tipsLoading,.tipsBox,.tipsSuccess,.tipsError{
	min-width:180px;
 	position:absolute;
	box-shadow:0 0 5px #ccc;
	top:40px;
 	}
.tipsLoading{
	background:#FFF1A8;
	}
.tipsBox{
	background:#F5F5F5;
	}
.tipsSuccess{
	background:#83BA1F;
	}
.tipsError{
	background:#F19317;
	}
.tipsAlert{
   box-shadow: 0 0 13px #999999;
   position: absolute;
   z-index:1001;
   background:#fff;
   }
.tipsAlertText{
	padding:40px;}
.tipsAlertFoot{
	padding:30px 40px;
	text-align:right;
	}
/* tips End */
	
/* 滚动条 */
.boxscroll {
 	overflow: hidden;
 }
.boxscrollColumn{
	margin-right:3px;
	background:#ccc;
	z-index:999;
	width:5px;
	}
.boxscrollColumn:hover{
	background:#999;
	}

.appWrapper{
	position:relative;
}
.appMask{
	display:none;
}
.appWrapper .appMask{
	display:block;
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	background:transparent;
	z-index:999;
}
.elDraggable{
	opacity:0.5
}

/*可视化助理*/
div[role=dragEmptyEl]{
	display:none;
}
.showEmptyEl div[role=dragEmptyEl]{
	display:block;
}
div[path]{
	/*outline:1px solid transparent;*/
	box-sizing: border-box;
	outline-offset:0px;
}
div[path].currentTools,#header.currentTools,#footer.currentTools{
	outline:1px solid #0CF !important;
}
.showElBorder div[role=dragEl]{
	outline:1px solid #F90;
	box-sizing: border-box;
}

.showBoxBorder div[path]:not([role=dragEl]){
	outline:1px dashed #00F;
	box-sizing: border-box;
}

.showBoxBorder #header {
	outline:3px solid  #F0F;
}

.showBoxBorder #footer {
	outline:3px solid #0F0;
}
.showDragHelper div[path]:not([path=app]),.showDragHelper #header,.showDragHelper #footer{
	padding:10px 0;
	
}
.showDragHelper .appWrapper{
	min-height:10px;
}
.showHideEl .hide_basic{
	display:block !important;
	opacity:0.3;
	}
.showHideEl .hide_basic .appMask{
	background:rgba(128,240,120,0.5);
	}

/*隐藏浮动元素*/
.hidePositionEl .positionEl_basic,.showHideEl.hidePositionEl  .positionEl_basic{
	display:none;
}

#app_frame{
	padding:20px;
}

@media (min-width: 1200px) {
	.showHideEl .hide_min1200{
		display:block !important;
		opacity:0.3;
		}
	.showHideEl .hide_min1200 .appMask{
		background:rgba(128,240,120,0.5);
	}	
	.showHideEl .show_min1200{
		display:block !important;
		opacity:1 !important;
		}
	.showHideEl .show_min1200 .appMask{
		background:transparent !important;
	}
	.hidePositionEl .positionEl_basic,.hidePositionEl .positionEl_min1200{
		display:none !important;
	}
}
@media (min-width: 961px) and (max-width: 1199px) {
	.showHideEl .hide_961_1199{
		display:block !important;
		opacity:0.3;
		}
	.showHideEl .hide_961_1199 .appMask{
		background:rgba(128,240,120,0.5);
	}
	.showHideEl .show_961_1199{
		display:block !important;
		opacity:1 !important;
		}
	.showHideEl .show_961_1199 .appMask{
		background:transparent !important;
	}
	
	.hidePositionEl .positionEl_basic,.hidePositionEl .positionEl_961_1199{
		display:none !important;
	}
}

@media (min-width: 768px) and (max-width: 960px) {
	.showHideEl .hide_768_960{
		display:block !important;
		opacity:0.3;
		}
	.showHideEl .hide_768_960 .appMask{
		background:rgba(128,240,120,0.5);
	}
	.showHideEl .show_768_960{
		display:block !important;
		opacity:1 !important;
		}
	.showHideEl .show_768_960 .appMask{
		background:transparent !important;
	}
	.hidePositionEl .positionEl_basic,.hidePositionEl .positionEl_768_960{
		display:none !important;
	}
}
@media (min-width: 480px) and (max-width: 767px) {
	.showHideEl .hide_480_767{
		display:block !important;
		opacity:0.3;
		}
	.showHideEl .hide_480_767 .appMask{
		background:rgba(128,240,120,0.5);
	}
	.showHideEl .show_480_767{
		display:block !important;
		opacity:1 !important;
		}
	.showHideEl .show_480_767 .appMask{
		background:transparent !important;
	}
	.hidePositionEl .positionEl_basic,.hidePositionEl .positionEl_480_767{
		display:none !important;
	}
}
@media (max-width: 479px) {
	.showHideEl .hide_max479{
		display:block !important;
		opacity:0.3;
		}
	.showHideEl .hide_max479 .appMask{
		background:rgba(128,240,120,0.5);
	}
	.showHideEl .show_max479{
		display:block !important;
		opacity:1 !important;
		}
	.showHideEl .show_max479 .appMask{
		background:transparent !important;
	}
	.hidePositionEl .positionEl_basic,.hidePositionEl .positionEl_max479{
		display:none !important;
	}
}


